﻿<%@ Page Title="Advertise" Language="C#" MasterPageFile="~/MasterPages/Ads.Master"
    AutoEventWireup="false" CodeBehind="JobDetails.aspx.cs" Inherits="JobSeek.Poster.JobDetails"
    EnableEventValidation="false" MaintainScrollPositionOnPostback="true" %>

<%@ Register TagPrefix="uc1" Src="~/Poster/Upload.ascx" TagName="Upload" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <!-- Skin CSS file -->
    <link rel="stylesheet" type="text/css" href="../Content/jquery.Jcrop.css" />
    <script type="text/javascript" src="../js/jquery.Jcrop.min.js"></script>
    <script type="text/javascript" src="../js/LogoCropper.js"></script>
    <script type="text/javascript">
        var marker;
        var map;
        var geocoder;
        var coordinates;
        var googleMapControl;

        $(window).load(function () {

            googleMapControl = $find("GoogleMap1");
            jcrop_api = $.Jcrop('#imgCurrent');
            jcrop_api.setOptions({
                onChange: update,
                onSelect: update,
                bgColor: 'black',
                bgOpacity: 0.6,
                keySupport: false
            });

            $("#cancel").click(function (e) {

                bound = new Array(0, 0, image.width(), image.height());
                jcrop_api.animateTo(bound);
            });


        });



        $(document).ready(function () {
            var pt1Val = 80;
            var pt2Val = 80;
            var pt3Val = 80;
            var summaryVal = 150;
            geocoder = new google.maps.Geocoder();

            $('#tbxPt1').keyup(function () {

                len = $('#tbxPt1').val().length;
                $('#lblPt1').text(pt1Val - len + " characters left");
            });

            $('#tbxPt2').keyup(function () {

                len = $('#tbxPt2').val().length;
                $('#lblPt2').text(pt1Val - len + " characters left");
            });

            $('#tbxPt3').keyup(function () {

                len = $('#tbxPt3').val().length;
                $('#lblPt3').text(pt1Val - len + " characters left");
            });
            $('#tbxShortDesc').keyup(function () {

                len = $('#tbxShortDesc').val().length;
                $('#lblSummary').text(summaryVal - len + " characters left");
            });

            $('#tbxJobTitle').keyup(function () {
                $('#titleH4').html($(this).val());
            });

        });



        ///////////////////////////////////////
        ///////// Google Map Region //////////
        //////////////////////////////////////
        function googleClientClick(overlay, point) {
            map = $find("GoogleMap1").map;
            map = overlay.map;
            placeMarker(point.latLng);
            googleMapControl.selectedCoord = point.latLng;

            //update the hidden value
            $('#hidLatLng').val(point.latLng.toString());
        };

        function codeAddress() {

            var address = document.getElementById("tbxStreet").value;
            map = $find("GoogleMap1").map;
            geocoder.geocode({ 'address': address }, geocoderCallback);


        }

        function codeLatLng(latLng) {

            geocoder.geocode({ 'latLng': latLng }, function (result, status) {
                if (status == google.maps.GeocoderStatus.OK) {

                    marker.setTitle(result[0].formatted_address);


                    $('#tbxStreet').val(result[0].formatted_address);


                }
            });

        }

        function geocoderCallback(result, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.panTo(result[0].geometry.location);
                marker = new google.maps.Marker({
                    map: map,
                    position: result[0].geometry.location,
                    title: result[0].formatted_address
                });

                map.setZoom(11);
                //update the hidden value
                $('#hidLatLng').val(result[0].geometry.location.toString());

            } else {
                alert("unable to find your address.");
            }
        }

        function placeMarker(latLng) {
            //document.getElementById("latLng").value = latLng.toString();

            if (marker) {
                marker.setPosition(latLng);

                codeLatLng(latLng);

            } else {
                marker = null;
                marker = new google.maps.Marker({
                    position: latLng,
                    map: map
                });
                codeLatLng(latLng);

            }

        }

        ///////////////////////////////////////
        ///// End of Google Map Region ////////
        //////////////////////////////////////


        function setVideo(value) {
            var video = document.getElementById("videoSection");
            if (value) {
                video.innerHTML = value;
                video.style.display = 'block';
            } else {
                video.style.display = 'none';
            }

        }
        function radioSelected(radio) {

            if (radio.checked) {
                $('#radioSelectedName').val(radio.id);
                var logo_url = radio.title;

                $('#tileLogoImg').attr('src', logo_url);



            }


        }






    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="content-wrapper">
        <asp:ValidationSummary ID="JobsDetailsSummary" runat="server" CssClass="error-message" />
        <section class="content">
            <header>
                <h3>
                    Job Information</h3>
            </header>
            <table>
                <tr>
                    <td class="column1">
                        <label for="tbxJobTitle">
                            Job Title
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td class="column2">
                        <asp:TextBox ID="tbxJobTitle" runat="server" ClientIDMode="Static" class="required"
                            MaxLength="100" Width="450"></asp:TextBox>
                    </td>
                    <td class="column3">
                        <asp:RequiredFieldValidator ID="RtbxJobTitle" runat="server" ErrorMessage="Job title is required."
                            ControlToValidate="tbxJobTitle" Display="None"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="tbxMainDesc">
                            Main Description
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td>
                        <asp:TextBox ID="tbxMainDesc" runat="server" TextMode="MultiLine" class="required"
                            Width="450" Height="421"></asp:TextBox><br />
                        <label id="tbxMainCharCount" class="charcount">
                            min 200 characters
                        </label>
                    </td>
                    <td>
                        <asp:RequiredFieldValidator ID="RtbxMainDesc" runat="server" ErrorMessage="Main description of the job is required."
                            ControlToValidate="tbxMainDesc" Display="None"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="tbxContact">
                            Contact Information
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td>
                        <asp:TextBox ID="tbxContact" runat="server" TextMode="MultiLine" class="required"
                            Width="450" Height="100" MaxLength="100"></asp:TextBox>
                    </td>
                    <td>
                        <asp:RequiredFieldValidator ID="RtbxContact" runat="server" ErrorMessage="Contact information is required."
                            ControlToValidate="tbxContact" Display="None"></asp:RequiredFieldValidator>
                    </td>
                </tr>
            </table>
        </section>
        <section class="content">
            <header>
                <h3>
                    Your personal ad tile
                </h3>
                <asp:RequiredFieldValidator ID="RtbxPt1" runat="server" ControlToValidate="tbxPt1"
                    Display="None" ErrorMessage="Selling point 1 is required."></asp:RequiredFieldValidator>
                <asp:RequiredFieldValidator ID="RtbxPt2" runat="server" ControlToValidate="tbxPt2"
                    Display="None" ErrorMessage="Selling point 2 is required"></asp:RequiredFieldValidator>
                <asp:RequiredFieldValidator ID="RtbxPt3" runat="server" ControlToValidate="tbxPt3"
                    Display="None" ErrorMessage="Selling point 3 is required"></asp:RequiredFieldValidator>
                <asp:RequiredFieldValidator ID="RtbxShortDesc" runat="server" ControlToValidate="tbxShortDesc"
                    Display="None" ErrorMessage="A short summary of the job is required."></asp:RequiredFieldValidator>
                <asp:RegularExpressionValidator ID="RegTbxPt1" runat="server" ControlToValidate="tbxPt1"
                    Display="None" ErrorMessage="You have entered more than the expected length"
                    ValidationExpression="^.{0,80}$"></asp:RegularExpressionValidator>
                <asp:RegularExpressionValidator ID="RegTbxPt2" runat="server" ControlToValidate="tbxPt2"
                    Display="None" ErrorMessage="You have entered more than the expected length"
                    ValidationExpression="^.{0,80}$"></asp:RegularExpressionValidator>
                <asp:RegularExpressionValidator ID="RegTbxPt3" runat="server" ControlToValidate="tbxPt3"
                    Display="None" ErrorMessage="You have entered more than the expected length"
                    ValidationExpression="^.{0,80}$"></asp:RegularExpressionValidator>
                <asp:RegularExpressionValidator ID="RegTbxSummary" runat="server" ControlToValidate="tbxShortDesc"
                    Display="None" ErrorMessage="You have entered more than the expected length"
                    ValidationExpression="^.{0,150}$"></asp:RegularExpressionValidator>
            </header>
            <article>
                <table>
                    <tr>
                        <td>
                            <section id="upload" style="display: block">
                                <uc1:Upload runat="server" ID="Upload1" />
                            </section>
                        </td>
                        <td style="width: 315px;">
                            <section class="tile">
                                <header class="controls">
                                    <div class="control-button">
                                    </div>
                                    <div class="control-button">
                                    </div>
                                    <div class="control-button">
                                    </div>
                                </header>
                                <div class="tileLogo">
                                    <table>
                                        <tr>
                                            <td style="width: 165px">
                                                <div id="title" style="width: 165px; word-wrap: normal">
                                                </div>
                                            </td>
                                            <td style="width: 131px">
                                                <img id="tileLogoImg" src="" />
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <div class="summary">
                                    <table>
                                        <tr>
                                            <td>
                                                <asp:TextBox ID="tbxPt1" TextMode="MultiLine" runat="server" placeholder="Selling point 1"
                                                    MaxLength="80" ClientIDMode="Static"></asp:TextBox>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <asp:TextBox ID="tbxPt2" TextMode="MultiLine" runat="server" placeholder="Selling point 2"
                                                    MaxLength="80"></asp:TextBox>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <asp:TextBox ID="tbxPt3" TextMode="MultiLine" runat="server" placeholder="Selling point 3"
                                                    MaxLength="80"></asp:TextBox>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <asp:TextBox ID="tbxShortDesc" runat="server" MaxLength="150" TextMode="MultiLine"
                                                    placeholder="Summary of your job" ClientIDMode="Static"></asp:TextBox>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <footer class="tile-footer">
                                </footer>
                            </section>
                            <ajaxToolkit:BalloonPopupExtender ID="tbxPt1_char_count" runat="server" CustomCssUrl=""
                                DisplayOnFocus="true" BalloonStyle="Rectangle" BalloonSize="Small" Enabled="True"
                                BalloonPopupControlID="charcount" TargetControlID="tbxPt1">
                            </ajaxToolkit:BalloonPopupExtender>
                            <div id="charcount">
                                <label id="lblPt1">
                                    80 characters
                                </label>
                            </div>
                            <ajaxToolkit:BalloonPopupExtender ID="tbxPt2_char_count" runat="server" CustomCssUrl=""
                                DisplayOnFocus="true" BalloonStyle="Rectangle" BalloonSize="Small" Enabled="True"
                                BalloonPopupControlID="charcount2" TargetControlID="tbxPt2">
                            </ajaxToolkit:BalloonPopupExtender>
                            <div id="charcount2">
                                <label id="lblPt2">
                                    80 characters
                                </label>
                            </div>
                            <ajaxToolkit:BalloonPopupExtender ID="tbxPt3_char_count" runat="server" CustomCssUrl=""
                                DisplayOnFocus="true" BalloonStyle="Rectangle" BalloonSize="Small" Enabled="True"
                                BalloonPopupControlID="charcount3" TargetControlID="tbxPt3">
                            </ajaxToolkit:BalloonPopupExtender>
                            <div id="charcount3">
                                <label id="lblPt3">
                                    80 characters
                                </label>
                            </div>
                            <ajaxToolkit:BalloonPopupExtender ID="tbxShortDesc_char_count" runat="server" CustomCssUrl=""
                                DisplayOnFocus="true" BalloonStyle="Rectangle" BalloonSize="Small" Enabled="True"
                                BalloonPopupControlID="charcount4" TargetControlID="tbxShortDesc">
                            </ajaxToolkit:BalloonPopupExtender>
                            <div id="charcount4">
                                <label id="lblSummary">
                                    150 characters
                                </label>
                            </div>
                        </td>
                    </tr>
                </table>
            </article>
        </section>
        <section class="content">
            <header>
                <h3>
                    Location</h3>
            </header>
            <table>
                <tr>
                    <td class="column1">
                        Location
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td class="column2">
                        <asp:UpdatePanel ID="LocationUpdatePanel" runat="server">
                            <ContentTemplate>
                                <asp:DropDownList ID="ddlLocation" runat="server" AutoPostBack="True" Width="110">
                                    <asp:ListItem Value="0" Selected="False">All Australia</asp:ListItem>
                                    <asp:ListItem disabled="true" style="font-weight: bold; color: Black;">Major Cities</asp:ListItem>
                                    <asp:ListItem Value="1">Brisbane</asp:ListItem>
                                    <asp:ListItem Value="2">Sydney</asp:ListItem>
                                    <asp:ListItem Value="3">Melbourne</asp:ListItem>
                                    <asp:ListItem Value="4">Perth</asp:ListItem>
                                    <asp:ListItem Value="5">Canberra</asp:ListItem>
                                    <asp:ListItem Value="6">Adelaide</asp:ListItem>
                                    <asp:ListItem Value="12">Horbart</asp:ListItem>
                                    <asp:ListItem Value="13">Gold Coast</asp:ListItem>
                                    <asp:ListItem Value="14">Darwin</asp:ListItem>
                                    <asp:ListItem Selected="False" disabled="true" style="font-weight: bold; color: Black;">Regional</asp:ListItem>
                                    <asp:ListItem Value="7">QLD</asp:ListItem>
                                    <asp:ListItem Value="8">NSW</asp:ListItem>
                                    <asp:ListItem Value="9">VIC</asp:ListItem>
                                    <asp:ListItem Value="10">WA</asp:ListItem>
                                    <asp:ListItem Value="11">SA</asp:ListItem>
                                    <asp:ListItem Value="15">TAS</asp:ListItem>
                                    <asp:ListItem Value="16">NT</asp:ListItem>
                                    <asp:ListItem Value="17">ACT</asp:ListItem>
                                </asp:DropDownList>
                                <asp:DropDownList ID="ddlSubLocation" runat="server" DataSourceID="SubLocationDataSource"
                                    Width="330" placeholder="Please select a sub location" DataTextField="sub_location_name"
                                    DataValueField="sub_loc_id">
                                </asp:DropDownList>
                                <asp:EntityDataSource ID="SubLocationDataSource" runat="server" ConnectionString="name=job_seekerEntities"
                                    DefaultContainerName="job_seekerEntities" EnableFlattening="False" EntitySetName="Sub_location"
                                    Select="it.sub_loc_id, it.sub_location_name" Where="it.location_id == @location_id">
                                    <WhereParameters>
                                        <asp:ControlParameter ControlID="ddlLocation" PropertyName="SelectedValue" DbType="Int32"
                                            Name="location_id" />
                                    </WhereParameters>
                                </asp:EntityDataSource>
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="ddlLocation" EventName="SelectedIndexChanged" />
                            </Triggers>
                        </asp:UpdatePanel>
                    </td>
                    <td class="column3">
                        <asp:RequiredFieldValidator ID="RddlLocation" runat="server" ControlToValidate="ddlLocation"
                            Display="None" ErrorMessage="Please select a state from the list."></asp:RequiredFieldValidator>
                        <asp:RequiredFieldValidator ID="RddlSubLocation" runat="server" ControlToValidate="ddlSubLocation"
                            Display="None" ErrorMessage="Please choose an area that is close the job's location."></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        Street Search
                    </td>
                    <td>
                    </td>
                    <td>
                        <asp:TextBox ID="tbxStreet" class="tbx-search" runat="server" placeholder="Street address"
                            ClientIDMode="Static" Width="330px"></asp:TextBox>
                        <input type="button" value="search" onclick="codeAddress()" class="btn-street-search" />
                    </td>
                    <td>
                    </td>
                </tr>
                <tr>
                    <td>
                    </td>
                    <td>
                    </td>
                    <td>
                        <artem:GoogleMap ID="GoogleMap1" runat="server" DefaultAddress="-25.7744, 134.2090"
                            MapType="Roadmap" ClientIDMode="Static" Height="450px" Width="450px" Zoom="3"
                            OnClientClick="googleClientClick">
                        </artem:GoogleMap>
                        <asp:HiddenField ID="hidLatLng" runat="server" Value="" ClientIDMode="Static" />
                    </td>
                    <td>
                    </td>
                </tr>
            </table>
           
            <article>
                <asp:TextBox ID="tbxVideo_url" runat="server" Width="450px" onchange="setVideo(this.value)"></asp:TextBox><br />
                <section id="videoSection" style="display: none">
                </section>
            </article>
            
        </section>
        <div class="content">
            <table>
                <tr>
                    <td class="column1">
                        <label for="ddlClassification">
                            Job Classification
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td class="column2">
                        <asp:DropDownList ID="ddlClassification" runat="server" DataSourceID="ClassificationEntity"
                            DataTextField="name" DataValueField="classification_id">
                        </asp:DropDownList>
                        <asp:EntityDataSource ID="ClassificationEntity" runat="server" ConnectionString="name=job_seekerEntities"
                            DefaultContainerName="job_seekerEntities" EnableFlattening="False" EntitySetName="Classifications"
                            EntityTypeFilter="Classification">
                        </asp:EntityDataSource>
                    </td>
                    <td class="column3">
                        <asp:RequiredFieldValidator ID="RddlClassification" runat="server" ErrorMessage="Please select a job classification from the list."
                            ControlToValidate="ddlClassification" Display="None" EnableTheming="True"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="ddlWorkType">
                            Work Type
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td>
                        <asp:DropDownList ID="ddlWorkType" runat="server">
                            <asp:ListItem Value="1">Full Time</asp:ListItem>
                            <asp:ListItem Value="2">Part Time</asp:ListItem>
                            <asp:ListItem Value="3">Vacation / Casual</asp:ListItem>
                            <asp:ListItem Value="4">Contract / Temp</asp:ListItem>
                        </asp:DropDownList>
                    </td>
                    <td>
                        <asp:RequiredFieldValidator ID="RddlWorkType" runat="server" ErrorMessage="Please select the working type."
                            ControlToValidate="ddlWorkType" Display="None"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="ddlWorkType">
                            Salary Range
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td>
                        <asp:UpdatePanel runat="server" ID="PayStructUpdatePanel">
                            <ContentTemplate>
                                <asp:DropDownList ID="ddlPayStruct" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlPayStruct_SelectedIndexChanged">
                                    <asp:ListItem Value="null" Selected="True" Text="Select a Salary Package" disabled="true"
                                        style="color: Black; font-weight: bold"></asp:ListItem>
                                    <asp:ListItem Value="annual" Text="Annual Salary"></asp:ListItem>
                                    <asp:ListItem Value="commision" Text="Commision"></asp:ListItem>
                                    <asp:ListItem Value="annualComm" Text="Annual + Commision"></asp:ListItem>
                                    <asp:ListItem Value="hourly" Text="Hourly"></asp:ListItem>
                                </asp:DropDownList>
                                <br />
                                <br />
                                <asp:DropDownList ID="ddlSalaryRangeFrom" runat="server" placeholder="Select a salary range"
                                    OnSelectedIndexChanged="ddlSalaryRangeFrom_SelectedIndexChanged" AutoPostBack="true">
                                </asp:DropDownList>
                                <asp:DropDownList ID="ddlSalaryRangeTo" runat="server" ClientIDMode="Static" AutoPostBack="true"
                                    placeholder="Select a salary range" OnSelectedIndexChanged="ddlSalaryRangeTo_SelectedIndexChanged">
                                </asp:DropDownList>
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="ddlPayStruct" EventName="SelectedIndexChanged" />
                                <asp:AsyncPostBackTrigger ControlID="ddlSalaryRangeFrom" EventName="SelectedIndexChanged" />
                                <asp:AsyncPostBackTrigger ControlID="ddlSalaryRangeTo" EventName="SelectedIndexChanged" />
                            </Triggers>
                        </asp:UpdatePanel>
                    </td>
                    <td>
                        <asp:RequiredFieldValidator ID="RddlSalaryPackage" runat="server" ErrorMessage="Please select a salary package"
                            ControlToValidate="ddlPayStruct" Display="None"></asp:RequiredFieldValidator>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="tbxSalaryRange">
                            Salary that will be displayed
                        </label>
                    </td>
                    <td class="column-star">
                        *
                    </td>
                    <td>
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                <asp:TextBox ID="tbxSalaryRange" runat="server" class="required" ClientIDMode="Static"></asp:TextBox>
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </td>
                    <td>
                        <asp:RequiredFieldValidator ID="RtbxSalary" runat="server" ErrorMessage="Please enter the salary that you wish to display on your ad tile"
                            ControlToValidate="tbxSalaryRange" Display="None"></asp:RequiredFieldValidator>
                    </td>
                </tr>
            </table>
        </div>
        <div class="content">
            <table>
                <tr>
                    <td class="column1">
                        <asp:Button ID="btnCancel" runat="server" Text="Cancel Form" />
                    </td>
                    <td class="column2">
                        <recaptcha:RecaptchaControl runat="server" ID="recaptcha1" PublicKey="6Lccxc8SAAAAAAPiT81r2ZQ2VtXJ9052w5SBCWPm"
                            PrivateKey="6Lccxc8SAAAAAJ5c6RFVlYw2jv6opKhJGseBwDYh" Theme="clean" />
                    </td>
                    <td class="column3">
                        <asp:Button ID="btnSubmit" runat="server" Text="Continue" OnClick="btnSubmit_Click" />
                    </td>
                </tr>
            </table>
        </div>
    </div>
</asp:Content>
